<!doctype html>
<html>
  <body>
    <div class="chrome">
      <div class="viewer">
      </div>

      <div class="sidebar sidebar-left">
        This is the left side bar. You can close it by clicking on the close button or by clicking anywhere in the article. Clicking in the sidebar itself should not close it.
        <button class="open-sidebar">Open left</button>
        <button class="close-sidebar">Close</button>
      </div>

      <div class="sidebar sidebar-right">
        <div class="content">
          This is the right side bar. Note that even though this sidebar is on the right, there are no predefined sidebar locations in Treesaver. You can position sidebars anywhere and style them as you please.
        </div>
        <button class="open-sidebar">Open right</button>
        <button class="close-sidebar">Close</button>
      </div>
    </div>

    <div class="grid">
      <div class="column"></div>
    </div>
  </body>
</html>
